<script setup>
/*属性绑定：将一个属性的值变成一个变量，从而可以动态地更新这个变量的值*/
import {ref} from 'vue'
const style = ref('style2')
</script>

<template>
  <!-- 将class属性的值变成一个变量 -->
    <div v-bind:class="style"></div>
  <br>
<!-- 属性绑定的精简方式  -->
  <div :class="style" ></div>
</template>

<style scoped>
  .style1{
    width: 120px;
    height: 120px;
    background-color: red;
  }
  .style2{
    width: 50px;
    height: 50px;
    background-color: blue;
  }
</style>